<template>
    <div>
        <el-dialog title="匿名举报，为防止滥用，仅管理员可见举报者" :visible.sync="dialogReportVisible" :show-close="false" :close-on-click-modal="false"
            @close="dialogReportClose">
            <el-form :model="reportForm" :rules="rules" ref="reportForm">
                <el-divider content-position="left">我要举报该问题，理由是：</el-divider>
                <el-input type="hidden" v-model="reportForm.question_id" autocomplete="off"></el-input>
                <el-form-item label="举报类型" prop="report_type"><br/>
                    <el-checkbox-group v-model="reportForm.report_type">
                        <el-checkbox label="垃圾广告:恶意灌水、广告、推广等内容" name="report_type"></el-checkbox><br/>
                        <el-checkbox label="无意义内容:测试、灌水、文不对题、消极内容、问题品质太差等" name="report_type"></el-checkbox><br/>
                        <el-checkbox label="违规内容:色情、暴力、血腥、敏感信息等" name="report_type"></el-checkbox><br/>
                        <el-checkbox label="不友善内容:人身攻击、挑衅辱骂、恶意行为" name="report_type"></el-checkbox><br/>
                        <el-checkbox label="标题随意:标题党、标题不释义" name="report_type"></el-checkbox><br/>
                        <el-checkbox label="错误分类:问题话题选择不合适" name="report_type"></el-checkbox><br/>
                        <el-checkbox label="严重非法言论:侮辱国家、发布谣言、邪教信仰、传销性质等" name="report_type"></el-checkbox>
                    </el-checkbox-group>
                </el-form-item>
                <el-form-item label="举报描述" prop="report_descrption">
                    <el-input type="textarea" v-model="reportForm.report_descrption"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogReportVisible = false">取 消</el-button>
                <el-button type="primary" @click="reportSubmit('reportForm')">提 交</el-button>
            </div>
        </el-dialog>
        <el-card class="box-card" style="min-height: 13.75rem;">
            <el-tabs v-model="activeTab" @tab-click="handleTabsClick">
                <el-tab-pane label="最新" name="questionLatest">
                    <div v-for="item in questionLatestList" :key="item.id" class="question-box">
                        <avue-article :option="option" :data="item"></avue-article>
                        <el-divider></el-divider>
                        <el-row>
                            <avue-avatar size="large" v-if="item.avatar !== ''" :src="item.avatar" icon="el-icon-s-custom"></avue-avatar>
                            <avue-avatar size="large" v-else-if="item.avatar === ''" icon="el-icon-s-custom"></avue-avatar>
                            <el-link @click="customer(item.user_id)" type="success" :underline="false">{{item.username}}<br />
                                {{item.topicname}}
                            </el-link>
                            <el-divider direction="vertical"></el-divider>
                            <el-link type="info" :underline="false">阅读({{item.read_count}})</el-link>
                            <div class="question-toolbar">
                                <el-link @click="detail(item)" type="primary">{{item.viewBtnNameDetail}}</el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="comment(item)" type="primary" :disabled="item.close_comment === 0 ? true : false">评论</el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="follower(item)" type="warning">
                                    <i v-if="item.has_followers" class="el-icon-bell" style="color: green;"></i>
                                    {{item.has_followers === 1 ? "取消关注" : "关注"}}({{item.followers_count}})
                                </el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="favourites(item)" type="warning">
                                    <i v-if="item.has_favourite" class="el-icon-star-on" style="color: green;"></i>
                                    {{item.has_favourite === 1 ? "取消喜欢" : "喜欢"}}({{item.favourite_count}})
                                </el-link>
                                <el-divider direction="vertical"></el-divider>

                                <el-link v-if="item.cates === 'blog'" @click="collections(item)" type="primary">
                                    {{item.has_collection === 1 ? "已收藏" : "收藏"}}({{item.collection_count}})
                                </el-link>
                                <el-divider v-if="item.cates === 'blog'" direction="vertical"></el-divider>

                                <el-link @click="report(item)" type="danger">举报</el-link>
                                <!-- <el-divider direction="vertical"></el-divider>
                                <el-link @click="share(item)" type="info">分享</el-link> -->
                            </div>
                        </el-row>
                        <el-divider></el-divider>
                    </div>
                    <el-pagination
                        @current-change="QLHandleCurrentChange"
                        :hide-on-single-page=true
                        prev-text="上一页"
                        next-text="下一页"
                        :current-page="page.currentPage"
                        :page-size="page.pageSize"
                        :page-count="page.total"
                        :total="page.total">
                    </el-pagination>
                </el-tab-pane>
                <el-tab-pane v-if="zhihuUserInfo != null" label="关注" name="questionFollower">
                    <div v-for="item in questionFollowerList" :key="item.id" class="question-box">
                        <avue-article :option="option" :data="item"></avue-article>
                        <el-divider></el-divider>
                        <el-row>
                            <avue-avatar size="large" v-if="item.avatar !== ''" :src="item.avatar" icon="el-icon-s-custom"></avue-avatar>
                            <avue-avatar size="large" v-else-if="item.avatar === ''" icon="el-icon-s-custom"></avue-avatar>
                            <el-link @click="customer(item.user_id)" type="success" :underline="false">{{item.username}}<br />
                                {{item.topicname}}
                            </el-link>
                            <el-divider direction="vertical"></el-divider>
                            <el-link type="info" :underline="false">阅读({{item.read_count}})</el-link>
                            <div class="question-toolbar">
                                <el-link @click="detail(item)" type="primary">{{item.viewBtnNameDetail}}</el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="comment(item)" type="primary" :disabled="item.close_comment === 0 ? true : false">评论</el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="follower(item)" type="warning">
                                    <i v-if="item.has_followers" class="el-icon-bell" style="color: green;"></i>
                                    {{item.has_followers === 1 ? "取消关注" : "关注"}}({{item.followers_count}})
                                </el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="favourites(item)" type="warning">
                                    <i v-if="item.has_favourite" class="el-icon-star-on" style="color: green;"></i>
                                    {{item.has_favourite === 1 ? "取消喜欢" : "喜欢"}}({{item.favourite_count}})
                                </el-link>
                                <el-divider direction="vertical"></el-divider>

                                <el-link v-if="item.cates === 'blog'" @click="collections(item)" type="primary">
                                    {{item.has_collection === 1 ? "已收藏" : "收藏"}}({{item.collection_count}})
                                </el-link>
                                <el-divider v-if="item.cates === 'blog'" direction="vertical"></el-divider>

                                <el-link @click="report(item)" type="danger">举报</el-link>
                                <!-- <el-divider direction="vertical"></el-divider>
                                <el-link @click="share(item)" type="info">分享</el-link> -->
                            </div>
                        </el-row>
                        <el-divider></el-divider>
                    </div>
                    <el-pagination
                        @current-change="QLHandleCurrentChange3"
                        :hide-on-single-page=true
                        prev-text="上一页"
                        next-text="下一页"
                        :current-page="page3.currentPage"
                        :page-size="page3.pageSize"
                        :page-count="page3.total"
                        :total="page3.total">
                    </el-pagination>
                </el-tab-pane>
                <el-tab-pane label="热榜" name="questionHot">
                    <div v-for="item in questionHotList" :key="item.id" class="question-box">
                        <avue-article :option="option" :data="item"></avue-article>
                        <el-divider></el-divider>
                        <el-row>
                            <avue-avatar size="large" v-if="item.avatar !== ''" :src="item.avatar" icon="el-icon-s-custom"></avue-avatar>
                            <avue-avatar size="large" v-else-if="item.avatar === ''" icon="el-icon-s-custom"></avue-avatar>
                            <el-link @click="customer(item.user_id)" type="success" :underline="false">{{item.username}}<br />
                                {{item.topicname}}
                            </el-link>
                            <el-divider direction="vertical"></el-divider>
                            <el-link type="info" :underline="false">阅读({{item.read_count}})</el-link>
                            <div class="question-toolbar">
                                <el-link @click="detail(item)" type="primary">{{item.viewBtnNameDetail}}</el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="comment(item)" type="primary" :disabled="item.close_comment === 0 ? true : false">评论</el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="follower(item)" type="warning">
                                    <i v-if="item.has_followers" class="el-icon-bell" style="color: green;"></i>
                                    {{item.has_followers === 1 ? "取消关注" : "关注"}}({{item.followers_count}})
                                </el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="favourites(item)" type="warning">
                                    <i v-if="item.has_favourite" class="el-icon-star-on" style="color: green;"></i>
                                    {{item.has_favourite === 1 ? "取消喜欢" : "喜欢"}}({{item.favourite_count}})
                                </el-link>
                                <el-divider direction="vertical"></el-divider>

                                <el-link v-if="item.cates === 'blog'" @click="collections(item)" type="primary">
                                    {{item.has_collection === 1 ? "已收藏" : "收藏"}}({{item.collection_count}})
                                </el-link>
                                <el-divider v-if="item.cates === 'blog'" direction="vertical"></el-divider>

                                <el-link @click="report(item)" type="danger">举报</el-link>
                                <!-- <el-divider direction="vertical"></el-divider>
                                <el-link @click="share(item)" type="info">分享</el-link> -->
                            </div>
                        </el-row>
                        <el-divider></el-divider>
                    </div>
                    <el-pagination
                        @current-change="QLHandleCurrentChange2"
                        :hide-on-single-page=true
                        prev-text="上一页"
                        next-text="下一页"
                        :current-page="page2.currentPage"
                        :page-size="page2.pageSize"
                        :page-count="page2.total"
                        :total="page2.total">
                    </el-pagination>
                </el-tab-pane>
                <el-tab-pane label="精华榜" name="questionCream">
                    <div v-for="item in questionCreamList" :key="item.id" class="question-box">
                        <avue-article :option="option" :data="item"></avue-article>
                        <el-divider></el-divider>
                        <el-row>
                            <avue-avatar size="large" v-if="item.avatar !== ''" :src="item.avatar" icon="el-icon-s-custom"></avue-avatar>
                            <avue-avatar size="large" v-else-if="item.avatar === ''" icon="el-icon-s-custom"></avue-avatar>
                            <el-link @click="customer(item.user_id)" type="success" :underline="false">{{item.username}}<br />
                                {{item.topicname}}
                            </el-link>
                            <el-divider direction="vertical"></el-divider>
                            <el-link type="info" :underline="false">阅读({{item.read_count}})</el-link>
                            <div class="question-toolbar">
                                <el-link @click="detail(item)" type="primary">{{item.viewBtnNameDetail}}</el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="comment(item)" type="primary" :disabled="item.close_comment === 0 ? true : false">评论</el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="follower(item)" type="warning">
                                    <i v-if="item.has_followers" class="el-icon-bell" style="color: green;"></i>
                                    {{item.has_followers === 1 ? "取消关注" : "关注"}}({{item.followers_count}})
                                </el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="favourites(item)" type="warning">
                                    <i v-if="item.has_favourite" class="el-icon-star-on" style="color: green;"></i>
                                    {{item.has_favourite === 1 ? "取消喜欢" : "喜欢"}}({{item.favourite_count}})
                                </el-link>
                                <el-divider direction="vertical"></el-divider>
                    
                                <el-link v-if="item.cates === 'blog'" @click="collections(item)" type="primary">
                                    {{item.has_collection === 1 ? "已收藏" : "收藏"}}({{item.collection_count}})
                                </el-link>
                                <el-divider v-if="item.cates === 'blog'" direction="vertical"></el-divider>
                    
                                <el-link @click="report(item)" type="danger">举报</el-link>
                                <!-- <el-divider direction="vertical"></el-divider>
                                <el-link @click="share(item)" type="info">分享</el-link> -->
                            </div>
                        </el-row>
                        <el-divider></el-divider>
                    </div>
                    <el-pagination
                        @current-change="QLHandleCurrentChange0"
                        :hide-on-single-page=true
                        prev-text="上一页"
                        next-text="下一页"
                        :current-page="page0.currentPage"
                        :page-size="page0.pageSize"
                        :page-count="page0.total"
                        :total="page0.total">
                    </el-pagination>
                </el-tab-pane>
                <el-tab-pane label="周榜" name="websiteset2">
                    <avue-empty desc="暂未开放,敬请期待"></avue-empty>
                </el-tab-pane>
                <el-tab-pane label="月榜" name="websiteset3">
                    <avue-empty desc="暂未开放,敬请期待"></avue-empty>
                </el-tab-pane>
                <el-tab-pane label="年榜" name="websiteset4">
                    <avue-empty desc="暂未开放,敬请期待"></avue-empty>
                </el-tab-pane>
                <el-tab-pane label="博文中心" name="questionBlog">
                    <div v-for="item in questionBlogList" :key="item.id" class="question-box">
                        <avue-article :option="option" :data="item"></avue-article>
                        <el-divider></el-divider>
                        <el-row>
                            <avue-avatar size="large" v-if="item.avatar !== ''" :src="item.avatar" icon="el-icon-s-custom"></avue-avatar>
                            <avue-avatar size="large" v-else-if="item.avatar === ''" icon="el-icon-s-custom"></avue-avatar>
                            <el-link @click="customer(item.user_id)" type="success" :underline="false">{{item.username}}<br />
                                {{item.topicname}}
                            </el-link>
                            <el-divider direction="vertical"></el-divider>
                            <el-link type="info" :underline="false">阅读({{item.read_count}})</el-link>
                            <div class="question-toolbar">
                                <el-link @click="detail(item)" type="primary">{{item.viewBtnNameDetail}}</el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="comment(item)" type="primary" :disabled="item.close_comment === 0 ? true : false">评论</el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="follower(item)" type="warning">
                                    <i v-if="item.has_followers" class="el-icon-bell" style="color: green;"></i>
                                    {{item.has_followers === 1 ? "取消关注" : "关注"}}({{item.followers_count}})
                                </el-link>
                                <el-divider direction="vertical"></el-divider>
                                <el-link @click="favourites(item)" type="warning">
                                    <i v-if="item.has_favourite" class="el-icon-star-on" style="color: green;"></i>
                                    {{item.has_favourite === 1 ? "取消喜欢" : "喜欢"}}({{item.favourite_count}})
                                </el-link>
                                <el-divider direction="vertical"></el-divider>
                    
                                <el-link v-if="item.cates === 'blog'" @click="collections(item)" type="primary">
                                    {{item.has_collection === 1 ? "已收藏" : "收藏"}}({{item.collection_count}})
                                </el-link>
                                <el-divider v-if="item.cates === 'blog'" direction="vertical"></el-divider>
                    
                                <el-link @click="report(item)" type="danger">举报</el-link>
                                <!-- <el-divider direction="vertical"></el-divider>
                                <el-link @click="share(item)" type="info">分享</el-link> -->
                            </div>
                        </el-row>
                        <el-divider></el-divider>
                    </div>
                    <el-pagination
                        @current-change="QLHandleCurrentChange1"
                        :hide-on-single-page=true
                        prev-text="上一页"
                        next-text="下一页"
                        :current-page="page1.currentPage"
                        :page-size="page1.pageSize"
                        :page-count="page1.total"
                        :total="page1.total">
                    </el-pagination>
                </el-tab-pane>
            </el-tabs>
        </el-card>
    </div>
</template>

<script>
    import {
        isNull
    } from '../util/util'
    import {
        getToken
    } from '../util/auth'
    export default {
        data() {
            return {
                zhihuUserInfo: null,
                activeTab: 'questionLatest',
                questionCreamList: [],
                page0: {
                    currentPage: 1,
                    total: 0,
                    pageSize: 10
                },
                questionBlogList: [],
                page1: {
                    currentPage: 1,
                    total: 0,
                    pageSize: 10
                },
                questionLatestList: [],
                page: {
                    currentPage: 1,
                    total: 0,
                    pageSize: 10
                },
                questionHotList: [],
                page2: {
                    currentPage: 1,
                    total: 0,
                    pageSize: 10
                },
                questionFollowerList: [],
                page3: {
                    currentPage: 1,
                    total: 0,
                    pageSize: 10
                },
                option: {
                    props: {
                        title: 'title',
                        meta: 'meta',
                        lead: 'lead',
                        body: 'body'
                    },
                },
                dialogReportVisible: false,
                formLabelWidth: '120px',
                reportForm: {
                    question_id: 0,
                    report_type: [],
                    report_descrption: ''
                },
                rules: {
                    report_type: [{
                        type: 'array',
                        required: true,
                        message: '请至少选择一个类型',
                        trigger: 'change'
                    }],
                    report_descrption: [{
                        required: true,
                        message: '请填写举报描述',
                        trigger: 'blur'
                    }, { min: 10, max: 200, message: '长度在 10 到 200 个字符', trigger: 'blur' }]
                }
            }
        },
        created() {
            if (localStorage.getItem('zhihuUserInfo') && localStorage.getItem('zhihuUserInfo') !== 'null' && getToken()) {
                this.zhihuUserInfo = JSON.parse(localStorage.getItem('zhihuUserInfo'))
            }
            this.getLatestQuestionList()
        },
        methods: {
            handleTabsClick(tab, event) {
                // console.log(tab.name);
                this.activeTab = tab.name
                if (tab.name === 'questionLatest') {
                    this.getLatestQuestionList()
                } else if (tab.name === 'questionHot') {
                    this.getHotQuestionList()
                } else if (tab.name === 'questionFollower') {
                    this.getFollowerQuestionList()
                } else if (tab.name === 'questionBlog') {
                    this.getBlogQuestionList()
                } else if (tab.name === 'questionCream') {
                    this.getCreamQuestionList()
                }
            },
            checkUserInfo() {
                return isNull(this.zhihuUserInfo) ? false : true;
            },
            customer(userId) {
                if (!this.checkUserInfo()) {
                    return
                }

                if (this.zhihuUserInfo.id === userId) {
                    this.$router.push({path: "/customer"})
                } else {
                    this.$router.push({path: `/custuser/${userId}`})
                }
            },
            detail(item) {
                const _this = this

                var tempBody = item.body;
                Vue.set(item, 'body', item.content)
                Vue.set(item, 'content', tempBody)
                var tempViewBtnNameDetail = item.viewBtnNameDetail;
                Vue.set(item, 'viewBtnNameDetail', item.viewBtnNameClose)
                Vue.set(item, 'viewBtnNameClose', tempViewBtnNameDetail)
                var viewReadTag = item.viewReadTag === 1 ? 0 : 1;
                Vue.set(item, 'viewReadTag', viewReadTag)

                if (viewReadTag === 0) {
                    const params = {
                        user_id: isNull(_this.zhihuUserInfo) ? 0 : _this.zhihuUserInfo.id,
                        question_id: item.id
                    }
                    _this.axios.post(_this.$API.ZHIHUAPI.viewShowQuestion, _this.qs.stringify(params)).then((res) => {
                        res = res.data
                        if (res.code === 10000) {
                            if (res.hasOwnProperty('data') && Object.keys(res.data).length > 0) {
                                if (res.data.hasread === 1) {
                                    Vue.set(item, 'read_count', item.read_count + 1)
                                }
                            }
                        }
                    }).catch(() => {})
                }
            },
            comment(item) {
                if (!this.checkUserInfo()) {
                    return this.$message({
                        showClose: false,
                        message: "您还没有登录",
                        type: 'warning'
                    })
                }
                this.$router.push({
                    path: '/questionComment',
                    query: {
                        question_id: item.id,
                        user_id: item.user_id
                    }
                })
            },
            follower(item) {
                if (!this.checkUserInfo()) {
                    return this.$message({
                        showClose: false,
                        message: "您还没有登录",
                        type: 'warning'
                    })
                }
                var followers;
                if (item.has_followers === 0) {
                    followers = 1;
                    Vue.set(item, 'has_followers', 1)
                    Vue.set(item, 'followers_count', item.followers_count + 1)
                    this.$message({
                        showClose: false,
                        message: "关注成功",
                        type: 'success'
                    })
                } else {
                    followers = 0;
                    Vue.set(item, 'has_followers', 0)
                    Vue.set(item, 'followers_count', item.followers_count - 1)
                    this.$message({
                        showClose: false,
                        message: "取消关注成功",
                        type: 'success'
                    })
                }

                const params = {
                    question_id: item.id,
                    followers: followers
                }
                this.handleAxiosFun(1, this.$API.ZHIHUAPI.followersQuestion, params)

                if (this.activeTab === 'questionFollower') {
                    this.getFollowerQuestionList()
                }
            },
            favourites(item) {
                if (!this.checkUserInfo()) {
                    return this.$message({
                        showClose: false,
                        message: "您还没有登录",
                        type: 'warning'
                    })
                }
                var favourite;
                if (item.has_favourite === 0) {
                    favourite = 1;
                    Vue.set(item, 'has_favourite', 1)
                    Vue.set(item, 'favourite_count', item.favourite_count + 1)
                    this.$message({
                        showClose: false,
                        message: "喜欢成功",
                        type: 'success'
                    })
                } else {
                    favourite = 0;
                    Vue.set(item, 'has_favourite', 0)
                    Vue.set(item, 'favourite_count', item.favourite_count - 1)
                    this.$message({
                        showClose: false,
                        message: "取消喜欢成功",
                        type: 'success'
                    })
                }

                const params = {
                    question_id: item.id,
                    favourite: favourite
                }
                this.handleAxiosFun(1, this.$API.ZHIHUAPI.favouriteQuestion, params)
            },
            collections(item) {
                if (!this.checkUserInfo()) {
                    return this.$message({
                        showClose: false,
                        message: "您还没有登录",
                        type: 'warning'
                    })
                }

                if (item.user_id === this.zhihuUserInfo.id) {
                    return this.$message({
                        showClose: false,
                        message: "是你自己的博文哦，不需要收藏！",
                        type: 'info'
                    })
                }

                var collection;
                if (item.has_collection === 0) {
                    collection = 1;
                    Vue.set(item, 'has_collection', 1)
                    Vue.set(item, 'collection_count', item.collection_count + 1)
                    this.$message({
                        showClose: false,
                        message: "收藏成功",
                        type: 'success'
                    })
                } else {
                    collection = 0;
                    Vue.set(item, 'has_collection', 0)
                    Vue.set(item, 'collection_count', item.collection_count - 1)
                    this.$message({
                        showClose: false,
                        message: "取消收藏成功",
                        type: 'success'
                    })
                }

                const params = {
                    question_id: item.id,
                    collection: collection
                }
                this.handleAxiosFun(1, this.$API.ZHIHUAPI.collectionQuestion, params)

            },
            report(item) {
                // console.log(3333)
                if (!this.checkUserInfo()) {
                    return this.$message({
                        showClose: false,
                        message: "您还没有登录",
                        type: 'warning'
                    })
                }
                if (item.user_id === this.zhihuUserInfo.id) {
                    return this.$message({
                        showClose: false,
                        message: "不能举报自己哦",
                        type: 'info'
                    })
                }
                this.dialogReportVisible = true
                this.reportForm.question_id = item.id
            },
            reportSubmit(formName) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        this.handleAxiosFun(0, this.$API.ZHIHUAPI.reportQuestion, this.reportForm)
                        this.dialogReportVisible = false
                    } else {
                        return false;
                    }
                });
            },
            dialogReportClose() {
                this.$refs.reportForm.resetFields();
            },
            share(item) {
                // console.log('share')
            },
            getCreamQuestionList() {
                const _this = this
                const fullscreenLoading = _this.$loading({
                    lock: true,
                    text: '拼命加载中',
                    spinner: 'el-icon-loading'
                })
                const params = {
                    page: _this.page0.currentPage,
                    limit: _this.page0.pageSize,
                    user_id: isNull(_this.zhihuUserInfo) ? 0 : _this.zhihuUserInfo.id,
                }
                _this.axios.post(_this.$API.ZHIHUAPI.getTopicCreamList, _this.qs.stringify(params)).then((res) => {
                    fullscreenLoading.close()
                    res = res.data
                    if (res.code === 10000) {
                        if (res.hasOwnProperty('data') && Object.keys(res.data).length > 0) {
                            _this.questionCreamList = res.data.list
                            _this.page0.total = res.data.count
                        } else {
                            _this.questionCreamList = []
                            _this.page0.total = 0
                        }
                    } else {
                        _this.$message({
                            showClose: false,
                            message: res.message,
                            type: 'error'
                        })
                        _this.questionCreamList = []
                        _this.page0.total = 0
                    }
                }).catch(() => {
                    fullscreenLoading.close()
                    _this.$message({
                        showClose: false,
                        message: '网络连接失败，请重试！',
                        type: 'error'
                    })
                    _this.questionCreamList = []
                    _this.page0.total = 0
                })
            },
            getLatestQuestionList() {
                const _this = this
                const fullscreenLoading = _this.$loading({
                    lock: true,
                    text: '拼命加载中',
                    spinner: 'el-icon-loading'
                })
                const params = {
                    page: _this.page.currentPage,
                    limit: _this.page.pageSize,
                    user_id: isNull(_this.zhihuUserInfo) ? 0 : _this.zhihuUserInfo.id,
                }
                _this.axios.post(_this.$API.ZHIHUAPI.getWebLatestQuestion, _this.qs.stringify(params)).then((res) => {
                    fullscreenLoading.close()
                    res = res.data
                    if (res.code === 10000) {
                        if (res.hasOwnProperty('data') && Object.keys(res.data).length > 0) {
                            _this.questionLatestList = res.data.list
                            _this.page.total = res.data.count
                        } else {
                            _this.questionLatestList = []
                            _this.page.total = 0
                        }
                    } else {
                        _this.$message({
                            showClose: false,
                            message: res.message,
                            type: 'error'
                        })
                        _this.questionLatestList = []
                        _this.page.total = 0
                    }
                }).catch(() => {
                    fullscreenLoading.close()
                    _this.$message({
                        showClose: false,
                        message: '网络连接失败，请重试！',
                        type: 'error'
                    })
                    _this.questionLatestList = []
                    _this.page.total = 0
                })
            },
            getHotQuestionList() {
                const _this = this
                const fullscreenLoading = _this.$loading({
                    lock: true,
                    text: '拼命加载中',
                    spinner: 'el-icon-loading'
                })
                const params = {
                    page: _this.page2.currentPage,
                    limit: _this.page2.pageSize,
                    user_id: isNull(_this.zhihuUserInfo) ? 0 : _this.zhihuUserInfo.id,
                }
                _this.axios.post(_this.$API.ZHIHUAPI.getWebHotQuestion, _this.qs.stringify(params)).then((res) => {
                    fullscreenLoading.close()
                    res = res.data
                    if (res.code === 10000) {
                        if (res.hasOwnProperty('data') && Object.keys(res.data).length > 0) {
                            _this.questionHotList = res.data.list
                            _this.page2.total = res.data.count
                        } else {
                            _this.questionHotList = []
                            _this.page2.total = 0
                        }
                    } else {
                        _this.$message({
                            showClose: false,
                            message: res.message,
                            type: 'error'
                        })
                        _this.questionHotList = []
                        _this.page2.total = 0
                    }
                }).catch(() => {
                    fullscreenLoading.close()
                    _this.$message({
                        showClose: false,
                        message: '网络连接失败，请重试！',
                        type: 'error'
                    })
                    _this.questionHotList = []
                    _this.page2.total = 0
                })
            },
            getFollowerQuestionList() {
                const _this = this
                const fullscreenLoading = _this.$loading({
                    lock: true,
                    text: '拼命加载中',
                    spinner: 'el-icon-loading'
                })
                const params = {
                    page: _this.page3.currentPage,
                    limit: _this.page3.pageSize,
                    user_id: isNull(_this.zhihuUserInfo) ? 0 : _this.zhihuUserInfo.id,
                }
                _this.axios.post(_this.$API.ZHIHUAPI.getFollowerQuestionList, _this.qs.stringify(params)).then((res) => {
                    fullscreenLoading.close()
                    res = res.data
                    if (res.code === 10000) {
                        if (res.hasOwnProperty('data') && Object.keys(res.data).length > 0) {
                            _this.questionFollowerList = res.data.list
                            _this.page3.total = res.data.count
                        } else {
                            _this.questionFollowerList = []
                            _this.page3.total = 0
                        }
                    } else {
                        _this.$message({
                            showClose: false,
                            message: res.message,
                            type: 'error'
                        })
                        _this.questionFollowerList = []
                        _this.page3.total = 0
                    }
                }).catch(() => {
                    fullscreenLoading.close()
                    _this.$message({
                        showClose: false,
                        message: '网络连接失败，请重试！',
                        type: 'error'
                    })
                    _this.questionFollowerList = []
                    _this.page3.total = 0
                })
            },
            getBlogQuestionList() {
                const _this = this
                const fullscreenLoading = _this.$loading({
                    lock: true,
                    text: '拼命加载中',
                    spinner: 'el-icon-loading'
                })
                const params = {
                    page: _this.page1.currentPage,
                    limit: _this.page1.pageSize,
                    user_id: isNull(_this.zhihuUserInfo) ? 0 : _this.zhihuUserInfo.id,
                }
                _this.axios.post(_this.$API.ZHIHUAPI.getBlogQuestionList, _this.qs.stringify(params)).then((res) => {
                    fullscreenLoading.close()
                    res = res.data
                    if (res.code === 10000) {
                        if (res.hasOwnProperty('data') && Object.keys(res.data).length > 0) {
                            _this.questionBlogList = res.data.list
                            _this.page1.total = res.data.count
                        } else {
                            _this.questionBlogList = []
                            _this.page1.total = 0
                        }
                    } else {
                        _this.$message({
                            showClose: false,
                            message: res.message,
                            type: 'error'
                        })
                        _this.questionBlogList = []
                        _this.page1.total = 0
                    }
                }).catch(() => {
                    fullscreenLoading.close()
                    _this.$message({
                        showClose: false,
                        message: '网络连接失败，请重试！',
                        type: 'error'
                    })
                    _this.questionBlogList = []
                    _this.page1.total = 0
                })
            },
            QLHandleCurrentChange0 (currentPage) {
                this.page0.currentPage = currentPage
                this.getCreamQuestionList()
            },
            QLHandleCurrentChange (currentPage) {
                this.page.currentPage = currentPage
                this.getLatestQuestionList()
            },
            QLHandleCurrentChange1 (currentPage) {
                this.page1.currentPage = currentPage
                this.getBlogQuestionList()
            },
            QLHandleCurrentChange2 (currentPage) {
                this.page2.currentPage = currentPage
                this.getHotQuestionList()
            },
            QLHandleCurrentChange3 (currentPage) {
                this.page3.currentPage = currentPage
                this.getFollowerQuestionList()
            },
            handleAxiosFun(tips, url, params, done, loading) {
                const _this = this
                _this.axios.post(url, _this.qs.stringify(params)).then((res) => {
                    if (res.data.code === 10000) {
                        if (tips === 0) {
                            _this.$message({
                                showClose: false,
                                message: res.data.message,
                                type: 'success'
                            })
                        }
                        // _this.refresh()
                        if (done) {
                            done()
                        }
                    } else {
                        _this.$message({
                            showClose: false,
                            message: res.data.message,
                            type: 'error'
                        })
                        if (loading) {
                            loading()
                        }
                    }
                }).catch(() => {
                    if (tips === 0) {
                        _this.$message({
                            showClose: false,
                            message: '网络连接失败，请重试！',
                            type: 'error'
                        })
                    }
                    if (loading) {
                        loading()
                    }
                })
            }
        }
    }
</script>

<style scoped>
    .question-toolbar {
        display: inline-block;
        float: right;
        margin-top: 8px;
    }
</style>
